.editPopup {
  width: 100%;
  padding: 20px;
  box-sizing: border-box;
  .et-flex-column-center();

  .name {
    width: 80%;
    font-size: @font-size-base;
    color: @text-color;
    margin-bottom: 20px;
    .et-flex-normal();
  }

  .addBox {
    width: 80%;
    margin-top: 10px;
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;

    .title {
      font-size: 15px;
      color: @text-color;
      margin-top: 10px;
    }

    .list {
      width: 80%;
      margin-left: 10px;
      box-sizing: border-box;
      border: 1px solid @divider-text-color;
      .et-flex-column-normal();

      .thred {
        width: 100%;
        .et-flex-start();

        .thredItem {
          flex: 1;
          width: 0;
          padding: 10px 0;
          box-sizing: border-box;
          text-align: center;

          &:nth-child(2) {
            flex: 0.4;
            border-left: 1px solid @divider-text-color;
          }
        }
      }

      .row {
        width: 100%;
        border-top: 1px solid @divider-text-color;
        display: flex;
        justify-content: flex-start;
        align-items: stretch;

        .cell {
          flex: 1;
          width: 0;
          padding: 10px 0;
          box-sizing: border-box;
          display: flex;
          justify-content: center;
          align-items: center;

          &:nth-child(2) {
            flex: 0.4;
            border-left: 1px solid @divider-text-color;
          }
        }
      }
    }
  }

  .addBtn {
    width: 100%;
    padding-left: 140px;
    box-sizing: border-box;
    margin-top: 10px;
    .et-flex-start();
  }

  .footer {
    width: 100%;
    margin-top: 20px;
    .et-flex-center();
  }
}